<template>
	<view class="u-p-t-22">
		<view class="item ">
			<view class="bottom-border flex-c" style="padding-bottom: 20rpx;">
				<view class="left">原密码</view>
				<view class="flex-c " style="width: 392rpx;">
					<u-input v-model="form_data.old" placeholder="请输入原密码" fontSize=' 28rpx'
						placeholderStyle="font-size: 28rpx" border="none" clearable></u-input>
				</view>
			</view>
			<view class="bottom-border flex-c" style="padding-bottom: 20rpx">
				<view class="left">新密码</view>
				<view class="flex-c " style="width: 392rpx;">
					<u-input v-model="form_data.new" placeholder="4-12位数字和字母组合" fontSize=' 28rpx'
						placeholderStyle="font-size: 28rpx" border="none" clearable></u-input>
				</view>
			</view>
			<view class=" flex-c" style="padding: 20rpx 0 0 0;">
				<view class="left">确认新密码</view>
				<view class="flex-c " style="width: 392rpx;">
					<u-input v-model="form_data.new" placeholder="4-12位数字和字母组合" fontSize=' 28rpx'
						placeholderStyle="font-size: 28rpx" border="none" clearable></u-input>
				</view>
			</view>
		</view>
		<view class="bottom-list2 ">
			<view class="flex-c-c tijiao">
				确定
			</view>
		</view>

	</view>
</template>

<script setup>
	import {
		reactive
	} from 'vue'
	const form_data = reactive({
		old: '',
		new: '',
		sure_new: ''
	})
</script>

<style scoped lang='scss'>
	.item {
		width: 702rpx;
		margin: 0 auto;
		background: #FFFFFF;
		border-radius: 24rpx;
		margin-bottom: 50rpx;
		padding: 20rpx 32rpx 20rpx 24rpx;

		.bottom-border {
			border-bottom: 2rpx dashed #F1F1F1;
		}

		.left {
			font-size: 28rpx;
			width: 180rpx;
			color: #000000;
		}

		.right {
			font-size: 28rpx;
			color: #999999;
		}

		.yan-zheng-ma {
			width: 160rpx;
			height: 48rpx;
			background: $main_color;
			border-radius: 12rpx 12rpx 12rpx 12rpx;
			margin-left: 24rpx;

			font-size: 28rpx;
			color: #FFFFFF;

		}
	}


	.bottom-list2 {
		width: 750rpx;

		.tijiao {
			width: 702rpx;
			margin: 0 auto;
			height: 80rpx;
			background:  $bg_color;
			border-radius: 44rpx 44rpx 44rpx 44rpx;
			font-size: 32rpx;
			color: white;
		}
	}
</style>